<template>
  <div class="order_complete">
    <!-- 按钮 -->
    <div class="btns">
      <el-form :inline="true" size="small">
        <el-form-item label="订单编号">
          <el-input v-model="param.code"></el-input>
        </el-form-item>
        <el-button size="small" icon="el-icon-search" @click="loadOrders">搜索</el-button>
      </el-form>
    </div>
    <!-- 按钮 -->
    <!-- 列表 -->
    <jacky-order v-if="orderData.list.length>0" :data="orderData.list" v-loading="loading" @toReceiving="toReceivingHandler"></jacky-order>
    <div v-else style="text-align:center;font-size:14px;padding:5em 0">
      还没有待收货的订单
    </div>
    <!-- /列表 -->

    <!-- 分页 -->
    <el-pagination background layout="prev, pager, next" small
      :hide-on-single-page="true"
      :total="orderData.total" 
      :page-size="orderData.pageSize" 
      :current-page="orderData.page"
      @current-change="currentChangeHandler">
    </el-pagination>
    <!-- 分页 -->
   
  </div>
</template>
<script>
import {get,post} from '@/utils/request'
import _ from 'lodash'
export default {
  data(){
    return {
      loading:false,
      param:{
        page:1,
        pageSize:5,
        orderStatus:"已发货"
      },
      orderData:{
        list:[]
      }
    }
  },
  created(){
    this.loadOrders();
  },
  methods:{
    toReceivingHandler(o){
      this.$confirm('是否确认收到获取?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let url ='/order/receiving'
        post(url,{id:o.id}).then(response =>{
          this.$message({type:'success',message:response.message})
          this.loadOrders();
        })
      })
    },
    // 查询
    loadOrders(){
      this.loading = true;
      let url = "/order/pageQuery"
      get(url,this.param).then(response => {
        this.orderData = response.data;
        this.loading = false;
      })
    },
    // 当前页发生改变
    currentChangeHandler(page){
      this.param.page = page;
      this.loadOrders();
    }
  }
}
</script>
